*{
    box-sizing: border-box;
    margin: 0;
    padding: 0;
}
a{
    text-decoration: none;
    color:#333333;
}
li{
    list-style:none;
}
img{
    vertical-align: bottom;
}
body {
    min-width: 320px;
    max-width: 750px;
    // flexible.js帮我们划分了10等份
    width:10rem;
    margin: 0 auto;
    line-height: 1.5;
    font-family: Arial,Helvetica;
    background: #F2F2F2;
}
input{
    outline:none;
    border:none;
    vertical-align: bottom;
}
// 如果我们的屏幕超过了750px,那么我们就按照750设计稿来做,不要让我们页面的宽度超过750px
@media screen and ( min-width: 750px ){
    html{
        font-size:75px !important;
    }
}

.search-content{
    width: 10rem;
    height: 1.173333rem;
    background: #f1a600;
    position: fixed;
    top: 0;
    left: 50%;
    transform: translateX(-50%);
    z-index:9999;
    display: flex;
    justify-content: space-between;
    align-items: center;
    .classify{
        width: .48rem;
        height: .8rem;
        margin-left: .266667rem;
        margin-right: .266667rem;
        background:url(../images/classify.png);
        background-size:cover;
    }
    .login{
        width: .48rem;
        height: .8rem;
        margin-left: .266667rem;
        margin-right: .266667rem;
        background:url(../images/login.png);
        background-size:cover;
    }
    .search{
        flex:1;
        background: white;
        height: .88rem;
        border-radius: .44rem;
        position: relative;
        .search_icon{
            width: .48rem;
            height: .48rem;
            background:url(../images/fdj.png) no-repeat;
            background-size:cover;
            position: absolute;
            top: 50%;
            left: .213333rem;
            z-index:1;
            transform: translateY(-50%);
        }
        input{
            width: 100%;
            height: .88rem;
            border-radius: .44rem;
            font-size:.293333rem;
            padding-left:.733333rem;
            position: absolute;
            left: 0;
            top: 0;
        }
    }
}


.banner{
    width: 10rem;
    padding-left: .32rem;
    padding-right: .32rem;
    margin-top: 1.36rem;
    .swiper-container {
        img{
            width: 100%;
            border-radius: .266667rem;
        }
        .swiper-pagination-bullet {
            width: .106667rem;
            height: .106667rem;
            display: inline-block;
            border-radius: 50%;
            background: #000;
            opacity: .5;
        }
        .swiper-pagination-bullet-active{
            opacity: 1;
            background: white;
            width: .24rem;
            border-radius: .066667rem;
        }
    }
}



.guanggao{
    width: 10rem;
    img{
        width: 100%;
    }
}


.icons{
    font-size:.32rem;
    ul{
        display: flex;
        flex-wrap: wrap;
        li{
            margin-top: .16rem;
            width: 20%;
            text-align: center;
            img{
                width: .933333rem;
            }
            p{
                margin-top: .133333rem;
                color:#858585;
            }
        }
    }
}

.new_user{
    width: 10rem;
    margin-top: .493333rem;
    display: flex;
    a{
        &:nth-child(1){
            flex:2;
        }
        &:nth-child(2){
            flex:1;
            margin-left: .026667rem;
            margin-right: .026667rem;
        }
        &:nth-child(3){
            flex:1;
        }
        img{
            width: 100%;
        }
    }
}

.recommend{
    padding:.32rem;
    display: flex;
    flex-wrap: wrap;
    .item{
        background: white;
        width: 4.666667rem;
        height: 3.44rem;
        padding: .333333rem;
        margin-bottom: .026667rem;
        margin-right: .026667rem;
        position: relative;
        &:nth-child(even){
            margin-right: 0;
        }
        .countDown{
            position: absolute;
            right: .64rem;
            top: .426667rem;
            color:#333333;
            font-size:.24rem;
            font-weight: bold;
            span{
                padding:.066667rem;
                box-sizing: content-box;
                background: #ffcc00;
                border-radius: .133333rem;
                margin-left: .08rem;
                margin-right: .08rem;
            }
        }
        .title{
            font-size: .373333rem;
            color:#333333;
            font-weight: bold;
        }
        .desc{
            color:#b5b5b5;
            font-size:.293333rem;
        }
        .product{
            display: flex;
            a{
                flex:1;
                text-align: center;
                img{
                    width: 1.546667rem;
                }
                .price{
                    color:#ff6f21;
                    font-size:.266667rem;
                }
                .product_name{
                    width: 2rem;
                    height: .72rem;
                    background:url(../images/content_bg.png);
                    background-size:100% 100%;
                    position: absolute;
                    bottom: .16rem;
                    font-size:.266667rem;
                    color:#333333;
                    line-height: 1.013333rem;
                }
            }
        }
    }

    .weinintuijian{
        width: 10rem;
        height: 2.293333rem;
        background: white;
        padding: .333333rem;
        display: flex;
        .left{
            width: 1.666667rem;
            .title{
                font-size: .373333rem;
                color:#333333;
                font-weight: bold;
                margin-top: .373333rem;
            }
            .desc{
                color:#b5b5b5;
                font-size:.293333rem;
            }
        }
        .right{
            flex:1;
            ul{
                display: flex;
                li{
                    width: 25%;
                    text-align: center;
                    img{
                        height: 1.333333rem;
                    }
                    p{
                        font-size:.266667rem;
                        color:#333333;
                        margin-top: .133333rem;
                    }
                }
            }
        }
    }
}
